<template>
  <!--<IndexChart v-if="indexStyle === 0"></IndexChart>-->
  <!--<IndexDef v-if="indexStyle === 1"></IndexDef>-->
  <!--<IndexBdc v-if="indexStyle == 2"></IndexBdc>-->
  <!--<IndexTask v-if="indexStyle == 3"></IndexTask>-->
  <!--<div style="width: 100%; text-align: right; margin-top: 20px">-->
  <!--  首页主题：-->
  <!--  <a-radio-group v-model:value="indexStyle">-->
  <!--    <a-radio :value="0">默认</a-radio>-->
  <!--    <a-radio :value="1">销量统计</a-radio>-->
  <!--    <a-radio :value="2">业务统计</a-radio>-->
  <!--    <a-radio :value="3">我的任务</a-radio>-->
  <!--  </a-radio-group>-->
  <!--</div>-->
  <div class="home-analysis">
    <div class="home-simple">
      <div class="welcome">
        <div class="icon">
          <check-outlined />
        </div>
        <div class="txt-wrap">
          <div>欢迎使用安全招标信息平台，首页功能开发中，敬请期待~</div>
          <div class="btn">
            <a-button type="primary" @click="handleGo">点击进入招标信息</a-button>
          </div>
        </div>
      </div>
      <div class="contact"></div>
      <div class="bottom-bg"></div>
    </div>
  </div>
</template>
<script lang="ts" setup>
  import { CheckOutlined } from '@ant-design/icons-vue';
  import { router } from '@/router';
  // import { ref } from 'vue';
  // import IndexDef from './homePage/IndexDef.vue';
  // import IndexChart from './homePage/IndexChart.vue';
  // import IndexBdc from './homePage/IndexBdc.vue';
  // import IndexTask from './homePage/IndexTask.vue';
  // const indexStyle = ref(0);

  const handleGo = () => {
    router.push({ path: '/information/tenderInformationList' });
  };
</script>
<style lang="less" scoped>
  .home-analysis {
    width: 100%;
    height: 100%;
    padding: 12px;
  }
  .home-simple {
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 6px;
    position: relative;
    .welcome {
      position: absolute;
      top: 20%;
      width: 100%;
      display: flex;
      align-items: flex-start;
      justify-content: center;
    }
    .icon {
      width: 100px;
      height: 100px;
      background: linear-gradient(rgb(71, 138, 228) 0%, rgb(13, 184, 251) 100%);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 70px;
      font-weight: 900;
      color: #fff;
    }
    .txt-wrap {
      font-size: 24px;
      color: #333;
      margin-left: 40px;
      .time {
        color: rgb(71, 138, 228);
      }
    }
    .contact {
      position: absolute;
      bottom: 7%;
      right: 5%;
      display: flex;
      align-items: flex-start;
      justify-content: flex-start;
      color: #fff;
      line-height: 2;
      z-index: 1;
    }
    .btn {
      margin-top: 32px;
      text-align: center;
      .el-button {
        padding: 14px 28px;
      }
    }
    .bottom-bg {
      position: absolute;
      z-index: 0;
      bottom: 0;
      width: 100%;
      height: 24%;
      background: linear-gradient(90deg, rgb(71, 138, 228) 0%, rgb(13, 184, 251) 100%);
    }
  }
</style>
